<template>
    <div class="select_class">
        <el-dialog v-model="dialogVisible" title>
            <template #header>
                <h2>选择班期</h2>
            </template>
            <el-table :data="StudentData">
                <el-table-column fixed prop="couresName" label="课程名称" width="200" />
                <el-table-column label="选择班期">
                    <template #default>
                        <el-select v-model="cN" class="m-2" placeholder="选择班期" size="large">
                            <el-option v-for="item in AllClass" :key="item" :label="item" :value="item" />
                        </el-select>
                    </template>
                </el-table-column>
            </el-table>
            <div class="Btn">
                <el-button @click="cancellation">取消</el-button>
                <el-button @click="Save">确定</el-button>
            </div>
        </el-dialog>
    </div>
</template>

<script setup>
// await studentDB.updateOne({phoneNumber:phoneNumber},{className:className}) 课程名称和手机号
import { reviseStudentClass } from '@/apis/student'
import { ref, defineExpose, defineEmits } from 'vue'
import { ElMessage } from 'element-plus';
const dialogVisible = ref(false)  // 控制是否开启弹窗
const StudentData = ref([]) // 学生信息列表，但永远只存储一个学生的
const AllClass = ref([]) // 存储该学生课程下对应的所有班期
const cN = ref('') // 选择的班期
const emit = defineEmits(['change'])

const open = ({ kindName, couresName, phoneNumber, className }, coureseObj) => {
    // 进来先初始化学生信息
    StudentData.value = [];
    cN.value = className

    // 将学生数据对象添加到StudentData数组中
    StudentData.value.push({ kindName, couresName, phoneNumber })
    dialogVisible.value = true

    // 获取当前该学生课程下对应的所有班期
    coureseObj.kindName.filter((item) => {
        if (item.value == kindName) {
            item.courseName.filter((item) => {
                if (item.value == couresName) {
                    AllClass.value = item.className
                }
            })
        }
    })
}
defineExpose({
    open
})

// 取消保存
const cancellation = () => {
    dialogVisible.value = false
    cN.value = ''
}
// 保存
const Save = async () => {
    const { data } = await reviseStudentClass({ phoneNumber: StudentData.value[0].phoneNumber, className: cN.value })
    dialogVisible.value = false;
    ElMessage.success(data.txt);
    emit('change');
}
</script>


<style lang="scss">
.Btn{
    margin: 20px 0 0 516px;
}
</style>